<html>
<body>
    Local: <br>
    <video id="localVideo" autoplay></video><br>
    Remote: <br>
    <video id="remoteVideo" autoplay></video>
 
    <script src="https://webrtc.github.io/adapter/adapter-1.0.2.js"></script>
    <script>
	console.log("First!!\n")
        var isCaller = window.location.href.split('#')[1];
 
        var socket = new WebSocket("wss://192.168.31.25:3000");
 
        var iceServer = {
            "iceServers": [
            {
//                "url": "stun:stun.l.google.com:19302"
                "url": "stun:192.168.219.146:3478"
            },
//            {   "url": "stun:stun.192.168.219.146:3478"},
            {
                "url": "turn:192.168.219.146:5349",
                "username": "test",
                "credential": "123456"
            }]
        };
 
	console.log("new RTCPeerC")
        //var pc = new webkitRTCPeerConnection(null);
        var pc = new RTCPeerConnection(null);
        //var pc = new RTCPeerConnection(iceServer);
 
        pc.onicecandidate = function(event){
            if (event.candidate !== null) {
                socket.send(JSON.stringify({
                    "event": "_ice_candidate",
                    "data": {
                        "candidate": event.candidate
                    }
                }));
            }
        };
        pc.ontrack = function(event){
	    console.log("ready to get remote video, event: ", event);
            document.getElementById('remoteVideo').srcObject = event.streams[0]
	    console.log("get remote video sucess");
        };
 
        var sendOfferFn = function(desc){
            pc.setLocalDescription(desc);
            socket.send(JSON.stringify({ 
                "event": "_offer",
                "data": {
                    "sdp": desc
                }
            }));
        },
        sendAnswerFn = function(desc){
            pc.setLocalDescription(desc);
            socket.send(JSON.stringify({ 
                "event": "_answer",
                "data": {
                    "sdp": desc
                }
            }));
        };
     

       
	console.log("ready to get media");
        var getUserMedia = navigator.getUserMedia ||
	                         navigator.webkitGetUserMedia ||
	                          navigator.mozGetUserMedia;
        getUserMedia({
            "audio": true,
            "video": true
        }, function(stream){
	    console.log("get media success! stream: ", stream);
            document.getElementById('localVideo').srcObject = stream;
            document.getElementById('localVideo').src.muted = true;
		
	    stream.getTracks().forEach(function(track) {
		pc.addTrack(track, stream)
	    });

            if(isCaller){
                pc.createOffer(sendOfferFn, function (error) {
                    console.log('Failure callback: ' + error);
                });
            }
        }, function(error){
            console.log('getUserMedia error: ' + error);
        });
 
        socket.onmessage = function(event){
            var json = JSON.parse(event.data);
            console.log('onmessage: ', json);
            if( json.event === "_ice_candidate" ){
                pc.addIceCandidate(new RTCIceCandidate(json.data.candidate));
            } else {
                pc.setRemoteDescription(new RTCSessionDescription(json.data.sdp));
                if(json.event === "_offer") {
                    pc.createAnswer(sendAnswerFn, function (error) {
                        console.log('Failure callback: ' + error);
                    });
                }
            }
        };
    </script>
</body>
</html>
